<template>
	<!-- 添加弹框 -->
	<el-dialog title="" width="40%" :append-to-body="true" visible :show-close="false" class="wrap" @close="cancel">
		<i class="el-icon-close close" @click="cancel" style="color: white;"></i>
		<div class="bt">补课单修改</div>
		<el-form label-width="100px" class="form">
			<el-form-item label="补课老师">
				<el-select v-model="vlsid" class="select-block" placeholder="请选择补课老师">
					<el-option :label="v.zwm" :value="v.id" v-for="v in comboxlist"></el-option>
				</el-select>
				</el-input>
			</el-form-item>

			<el-form-item label="补课时间">
				<el-date-picker v-model="vbtime" type="date" :editable="false" class="select-block" placeholder="请选择日期"> </el-date-picker>
			</el-form-item>
			<el-form-item label="上课时间段">
				<el-select v-model="sjd1" style="width: 80px;">
					<el-option v-for=" v in hourlist " :label="v" :value="v"></el-option>
				</el-select>
				<el-select v-model="sjd2" style="width: 80px;">
					<el-option v-for=" v in minslist " :label="v" :value="v"></el-option>
				</el-select>
				<span class="a" style=""> &nbsp;&nbsp;--&nbsp;&nbsp; </span>
				<el-select v-model="sjd3" style="width: 80px;">
					<el-option v-for=" v in hourlist " :label="v" :value="v"></el-option>
				</el-select>
				<el-select v-model="sjd4" style="width: 80px;">
					<el-option v-for=" v in minslist " :label="v" :value="v"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="课程名称" v-if="kcxs">
				<el-select v-model="vkcid" placeholder="请选择课程" @change="getdaylist()" class="select-block1">
					<el-option :label="v.mc" :value="v.id+''" v-for="v in xzkclist"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="Day" v-if="kcxs">
				<el-select v-model="vdayid" placeholder="请选择Day" class="select-block1">
					<el-option :label="v.day1" :value="v.day2+''" v-for="v in daylist"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="备注提示">
				<el-input v-model="vbz" placeholder="" type="textarea" class="select-block"></el-input>
			</el-form-item>
			<el-form-item label="补课学生">
				<!--<el-tag style="margin-left:10px;" closable :disable-transitions="false"  @close="submit(v.id)" v-for="v in xslist">{{v.zwm}}</el-tag>-->
				<ul>
					<li style="border: none;"><span style="width: 100%; text-align: right;"><el-button type="" size="small"  @click="add()">添加补课学生</el-button></span></li>
					<li v-for="(i,index) in xsxx">
						<span>{{i.zwm}}</span>
						<span>{{i.mc}}</span>
						<span>{{i.lx=='kq'? '考勤' :(i.lx=='sf'? '收费' : '成绩')}}</span>
						<!--<span>{{i.lx}}</span>-->
						<span style="float: right; text-align: center;"><el-button type=""  size="mini" @click="yc(index)">移除</el-button></span>
					</li>
				</ul>
			</el-form-item>
		</el-form>
		<el-button type="primary" class="submit" @click="saveinfo">保存</el-button>
		<el-button type="danger" class="submit" @click="cancel">退出</el-button>
		<AddComponent v-if="addxslist" @close="addshow"></AddComponent>
	</el-dialog>
</template>
<script type="text/javascript">
	import qs from 'qs'
	import AddComponent from './add'
	export default {
		props: ['params'],
		components: {
			AddComponent
		},
		data() {
			return {
				//				pickerOptions0: {
				//		          disabledDate(time) {
				//		             return time.getTime() < Date.now() - 8.64e6      
				//		          }
				//		        },
				kcxs:false,
				vkcid: '',
				xzkclist: [],
				daylist: [],
				vdayid: '',
				addxslist: false,
				vlsid: '',
				vbtime: '',
				vbz: '',
				comboxlist: [],
				xsxx: [],
				xslist: [],
				sjd1: '',
				sjd2: '',
				sjd3: '',
				sjd4: '',
				hourlist: ['', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22'],
				minslist: ['', '00', '05', '10', '15', '20', '25', '30', '35', '40', '45', '50', '55'],
				dialogTableVisible: true,
			}
		},
		created() {
			//			this.getxslist()
			//			this.vlsid = this.params.row.lsid
			//			this.vlsmc = this.params.row.lsmc
			//			this.vbtime = this.params.row.bksj
			this.getxzkclist();
			this.getcomboxlist()
			//			 this.bukeinfo()
			console.log(this.params, 9888)
			if(this.params.row.mxid) {
				this.bkapid = ''
				var list = []
				list = this.params.row
				this.xsxx.push(list)
				if(this.xsxx[0].lx == 'sf'){
					this.kcxs = true
				}
			} else {
				this.bkapid = this.params.row.id
				this.bukeinfo()
			}
		},
		methods: {
			getxzkclist() {
				var logininfo = JSON.parse(localStorage.logininfo);
				this.searchLoading = true;
				var params2 = qs.stringify({
					yhid: logininfo.id,
					xxid: logininfo.xxid
				})
				//执行
				this.axios.post(this.$store.state.api + 'kcfl/getfllist', params2)
					.then(res => {
						this.xzkclist = res.data.data.list;
					}).catch(res => {})
			},
			getdaylist() {
				var logininfo = JSON.parse(localStorage.logininfo);
				this.searchLoading = true;
				var params2 = qs.stringify({
					kcflid: this.vkcid,
					yhid: logininfo.id,
					xxid: logininfo.xxid
				})
				//执行
				this.axios.post(this.$store.state.api + 'xsbkap/getday', params2)
					.then(res => {
						console.log(res, 'dayyy')
						this.daylist = res.data.data.list;
					}).catch(res => {})
			},
			add() {
				this.addxslist = true
			},
			addshow(data) {
				for(var i in data.data) {
					this.xsxx.push(data.data[i])
				}
				this.addxslist = false
			},
			saveinfo() {
				console.log(this.xsxx)
				if(this.params.row.lx == 'sf') {
					if(!this.vkcid) {
						this.$message.error("请选择课程!")
						return
					}
					if(!this.vdayid) {
						this.$message.error("请选择Day!")
						return
					}
				}
				if(!this.vlsid) {
					this.$message.error("请选择补课老师!")
					return
				}
				if(!this.vbtime) {
					this.$message.error("请选择补课时间!")
					return
				}
				let mxids = ''
				for(var i in this.xsxx) {
					mxids += "," + this.xsxx[i].mxid
				}
				var sjd = this.sjd1 + ":" + this.sjd2 + "-" + this.sjd3 + ":" + this.sjd4
				var time1 = this.$.getLocalTimeNo0(Date.parse(this.vbtime));
				var logininfo = JSON.parse(localStorage.logininfo);
				this.searchLoading = true;
				var params2 = qs.stringify({
					bkapid: this.bkapid,
					xsids: mxids,
					sjd: sjd,
					sj: time1,
					bz: this.vbz,
					lsid: this.vlsid,
					xxid: logininfo.xxid,
					yhid: logininfo.id,
				})
				//执行
				this.axios.post(this.$store.state.api + 'bkap/check', params2)
					.then(res => {
						console.log(res, 'dsakuhd')
						if(res.data.code == 1) {
							if(res.data.data > 0) {
								this.tjadd(res.data.data)
							} else {
								this.$emit('close', {
									type: 'edit',
									cancel: false
								});
								this.$message.success(res.data.msg);
								this.$store.state.loading = false;
							}
						} else {
							this.$message.warning(res.data.msg);
							this.$store.state.loading = false;
						}
					}).catch(res => {
						this.$message.error("服务器异常");
						this.$emit('close', {
							type: 'edit',
							cancel: true
						});
					})

			},
			tjadd(id) {

				var logininfo = JSON.parse(localStorage.logininfo);
				this.searchLoading = true;
				var params2 = qs.stringify({
					bkapid: id,
					day: this.vdayid,
					kcflid: this.vkcid,
					kqjlid: '',
					bjid: this.params.row.bjid + '',
					lx: this.params.row.lx + '',
					kslx: '',
					xsid: this.params.row.id + '',
					xxid: logininfo.xxid + '',
				})
				//执行
				this.axios.post(this.$store.state.api + 'xsbkap/insert', params2)
					.then(res => {
						if(res.data.code == 1) {
							this.$emit('close', {
								type: 'edit',
								cancel: false
							});
							this.$message.success(res.data.msg);
							this.$router.push('/educa/lsbkap')
							this.$store.state.loading = false;
						} else {
							this.$message.warning(res.data.msg);
							this.$store.state.loading = false;
						}
					}).catch(res => {
						//					   this.$message.warning("服务器异常");
						//			 				this.$emit('close', { type: 'edit', cancel: true });
					})

			},
			bukeinfo() {
				var logininfo = JSON.parse(localStorage.logininfo);
				this.searchLoading = true;
				var params2 = qs.stringify({
					id: this.bkapid,
					xxid: logininfo.xxid,
					yhid: logininfo.id,
				})
				//执行
				this.axios.post(this.$store.state.api + 'bkap/info', params2)
					.then(res => {
						if(res.data.code == 1) {
							console.log(res, 123)
							let data = res.data.data
							this.xsxx = data.list
							this.vlsid = data.info[0].lsid
							this.vbtime = data.info[0].sj
							this.vbz = data.info[0].bz
							this.sjd1 = data.info[0].sjd.substring(0, 2)
							this.sjd2 = data.info[0].sjd.substring(3, 5)
							this.sjd3 = data.info[0].sjd.substring(6, 8)
							this.sjd4 = data.info[0].sjd.substring(9, 11)
						} else {
							this.$message.warning(res.data.msg);
							this.$store.state.loading = false;
						}
					}).catch(res => {
						//					   this.$message.warning("服务器异常");
						//			 				this.$emit('close', { type: 'edit', cancel: true });
					})

			},
			yc(index) {
				this.xsxx.splice(index, 1)
			},

			cancel() {
				this.$emit('close', {
					type: 'edit',
					cancel: true
				})
			},
			getcomboxlist() {
				var logininfo = JSON.parse(localStorage.logininfo);
				// this.searchLoading = true;
				this.axios.get(this.$store.state.api + 'ls/mc', {
					params: {
						xxid: logininfo.xxid
					}
				}).then(res => {
					let data = res.data.data;
					let list = data;
					this.comboxlist = list;
				}).catch(res => {
					// this.searchLoading = false;
				})
			}
		}
	}
</script>
<style lang="less" scoped>
	.wrap {
		.row {
			height: 50px;
			line-height: 50px;
		}
		ul {
			li {
				width: 90%;
				overflow: hidden;
				border: 1px solid #D8DCE5;
				margin-top: 5px;
				span {
					/*border: 1px solid #D8DCE5;*/
					width: 22%;
					height: 40px;
					text-align: center;
					float: left;
				}
			}
		}
		.bt {
			position: absolute;
			width: 100%;
			height: 50px;
			margin: 0 auto;
			top: 0;
			left: 0;
			// margin-top: -70px;
			background: #50BFFF;
			// margin-left: -20px;
			// margin-bottom: 20px;
			color: white;
			text-align: left;
			line-height: 50px;
			font-size: 17px;
			padding-left: 15px;
		}
		.close {
			z-index: 10;
			position: absolute;
		}
		.input-block {
			margin-bottom: 20px;
			text-align: center;
		}
		.input {
			width: 280px;
			display: inline-block;
			margin-left: 10px;
		}
		.input1 {
			width: 210px;
			display: inline-block;
			margin-left: 10px;
		}
		.input-block span {
			display: inline-block;
			width: 70px;
			text-align: right;
		}
		.submit {
			width: 120px;
			margin-left: 18%;
		}
		.wpfl {
			background: #fff;
			position: absolute;
			top: 5px;
			left: 5px;
		}
		.wpfl1 {
			width: 130%;
			background: #fff;
			position: absolute;
			top: 5px;
			left: -66px;
		}
		.form {
			text-align: left;
			margin-top: 20px;
			.select-block {
				width: 85%;
				display: block;
			}
			.select-block1 {
				width: 68%;
				// display: block;
			}
		}
	}
</style>